<template>
  <monaco-editor :model-value="pretty" language="json" :height="height" read-only/>
</template>
<script lang="ts" setup>
import {formatJsonString} from "$/util";

const props = defineProps({
  value: String,
  height: String,
});

const pretty = computed(() => {
  if (props.value) {
    return formatJsonString(props.value);
  }else {
    return '{}';
  }
});
</script>
<script lang="ts">
export default defineComponent({
  name: 'monaco-view',
});
</script>
<style lang="less">
</style>
